﻿<!doctype html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">

<div th:replace="home/module/_header"></div>
<main>
    <div id="results">
        <div class="container">
            <div class="row justify-content-between">
                <div class="col-lg-3 col-md-4 col-10">
                    <h1><strong>[[${pageInfo.total}]]</strong> 条结果 [[${title}]]</h1>
                </div>
                <div class="col-xl-3 col-md-3 col-2">
                    <form action="">
                        <a href="#0" class="search_mob btn_search_mobile"></a> <!-- /open search panel -->
                        <div class="row no-gutters custom-search-input-2 inner">

                            <div class="col-lg-11">
                                <div class="form-group">
                                    <input class="form-control" name="keywords" th:value="${keywords}" type="text"
                                           placeholder="搜索菜品...">
                                </div>
                            </div>
                            <div class="col-xl-1 col-lg-1">
                                <input type="submit" value="Search">
                            </div>
                        </div>
                    </form>
                </div>
            </div>
            <!-- /row -->
            <div class="search_mob_wp">
                <form action="/dish">
                    <div class="custom-search-input-2">
                        <div class="form-group">
                            <input class="form-control" name="keywords" th:value="${keywords}" type="text"
                                   placeholder="搜索菜品...">
                            <i class="icon_search"></i>
                        </div>
                        <input type="submit" value="搜索">
                    </div>
                </form>
            </div>
            <!-- /search_mobile -->
        </div>
        <!-- /container -->
    </div>
    <!-- /results -->

    <div class="container margin_60_35">

        <div class="isotope-wrapper">

            <div class="company_listing isotope-item high"
                 th:each="item : ${dataList}">
                <div class="row">
                    <div class="col-md-9">
                        <div class="company_info">
                            <figure>
                                <a th:href="'/dish/'+${item.id}">
                                    <img th:src="${item.photo}" alt="">
                                </a>
                            </figure>
                            <h3>
                                <a th:href="'/dish/'+${item.id}" style="color: #222222;">[[${item.name}]]</a>
                            </h3>
                            <p th:utext="${item.content}"></p>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="text-center float-lg-right">
                            <span style="margin: auto; display: block;color: #e04040; font-size: 12px; font-size: 0.75rem; font-weight: bold">[[${item.price}]]元</span>
                            <span class="rating"> <strong>[[${item.commentSize}]]条评价 &nbsp;[[${item.score}]]分</strong>

                                   <span th:if="${item.score < 1}">
                                    <i class="icon_star empty" th:each="i: ${#numbers.sequence(1, 5)}"></i>
                                </span>
                                <span th:if="${item.score >= 1 && item.score < 2}">
                                    <i class="icon_star" th:each="i: ${#numbers.sequence(1, 1)}"></i>
                                    <i class="icon_star empty" th:each="i: ${#numbers.sequence(1, 4)}"></i>
                                </span>
                                <span th:if="${item.score >= 2 && item.score < 3}">
                                    <i class="icon_star" th:each="i: ${#numbers.sequence(1, 2)}"></i>
                                    <i class="icon_star empty" th:each="i: ${#numbers.sequence(1, 3)}"></i>
                                </span>
                                <span th:if="${item.score >= 3 && item.score < 4}">
                                    <i class="icon_star" th:each="i: ${#numbers.sequence(1, 3)}"></i>
                                    <i class="icon_star empty" th:each="i: ${#numbers.sequence(1, 2)}"></i>
                                </span>
                                <span th:if="${item.score >= 4 && item.score < 5}">
                                    <i class="icon_star" th:each="i: ${#numbers.sequence(1, 4)}"></i>
                                    <i class="icon_star empty" th:each="i: ${#numbers.sequence(1, 1)}"></i>
                                </span>

                                <span th:if="${item.score >= 5}">
                                    <i class="icon_star" th:each="i: ${#numbers.sequence(1, 5)}"></i>
                                </span>

                                </span>
                            <a th:href="'/dish/'+${item.id}" class="btn_1 small">查看详情</a>
                        </div>
                    </div>
                </div>
            </div>
            <!-- /company_listing -->

        </div>
        <!-- /isotope-wrapper -->

        <div class="pagination__wrapper add_bottom_30">
            <ul class="pagination" th:if="${pageInfo.total > 0}">
                <li th:if="${pageInfo.current > 1}">
                    <a class="prev" tabindex="-1"
                       th:href="'?page='+${pageInfo.current-1}+'&keywords='+${keywords}">
                        ❮
                    </a>
                </li>
                <li th:each="i: ${#numbers.sequence(1, pageInfo.pages)}" th:if="${pageInfo.pages > 1}">
                    <a th:classappend="${pageInfo.current == i ? 'active' : ''}"
                       th:href="'?page='+${i}+'&keywords='+${keywords}">[[${i}]]</a>
                </li>
                <li th:if="${pageInfo.pages > pageInfo.current}">
                    <a class="next"
                       th:href="'?page='+${pageInfo.current+1}+'&keywords='+${keywords}">
                        ❯
                    </a>
                </li>
            </ul>
        </div>


    </div>
    <!-- /container -->

</main>
<!--/main-->

<div th:replace="home/module/_footer"></div>
